// *{
//   margin:0;
//   padding:0;
// }
// .toup{
//     overflow: hidden;
//     position: relative;
//     left: 0;
//     width: 120rem;
//     box-sizing: border-box;
//        -webkit-transition: left 0.2s;
//         -moz-transition: left 0.2s;
//        -ms-transition: left 0.2s;
//        -o-transition: left 0.2s;
//         transition: left 0.2s;
//   .scores{
//     float: left;
//     width: 100vw;
//     padding: .3rem .4rem 0rem .4rem;
//     .top-text{
//       font-size: .2rem;
//       color: #333;
//       text-align: center;
//       font-weight: normal;
//       margin-bottom: .3rem;
//     }
//     .title{
//       font-size: .18rem;
//       margin-bottom: .34rem;
//       padding-left: .15rem;

//     }
//     .choose{
//       line-height: .25rem;
//       font-size: .15rem;
//       .required{
//         max-width:3rem;
//         height:1.29rem;
//       }
//       .input{
//         margin-bottom: 0.38rem;
//         position: relative;
//         line-height: .3rem;
//         text-align: justify;
//         padding-left: .15rem;

//         input[type='radio']{
//           position: absolute;
//           left: 0.18rem;
//           top: 0.08rem;
//           vertical-align: middle;
//         }
//         input[type='checkbox']{
//           position: absolute;
//           left: 0.18rem;
//           top: 0.08rem;
//           vertical-align: middle;
//         }
//         .text-rg{
//           font-size: 0.18rem;
//           display: inline-block;
//           padding-left: 0.2rem;
//           line-height: 0.33rem;
//           text-align: justify;
//           .desc{
//             margin-right:.2rem;
//           }
//         }
//         .radioText{
//           width: 1.5rem;
//           margin-left: .1rem;
//         }
//         .checkText{
//           width: 1.5rem;
//           margin-left: .1rem;
//         }
//       }
//     }
//   }

//   .preNexts{
//     width: 90%;
//     height: 0.88rem;
//     position: fixed;
//     bottom:.2rem;
//     left:50%;
//     margin-left: -45%;
//     box-sizing: border-box;
//     .prev{
//       width: 45%;
//       height: 0.5rem;
//       float: left;
//       line-height: 0.5rem;
//       font-size: 0.18rem;
//       color: #fff;
//       background: #3fd0db;
//       text-align: center;
//       &.add{
//         background: #bdbdbd;
//       }
//     }

//     .next{
//       width: 45%;
//       height: 0.5rem;
//       float: right;
//       line-height: 0.5rem;
//       font-size: 0.18rem;
//       color: #fff;
//       background: #3fd0db;
//       text-align: center;
//     }
//     .order{
//       font-size:.18rem;
//       text-align: center;
//       padding-bottom: .1rem;
//     }
//   }

//   .page-text {//遮罩层
//     display: block;
//     &.hide {
//       display: none;
//     }
//     position: fixed;
//     left: 0;
//     top: 0;
//     right: 0;
//     bottom: 0;
//     background: rgba(0, 0, 0, .5);
//     z-index: 9999;
//     .center-box {
//       position: absolute;
//       top: 50%;
//       left: 50%;
//       margin-top: -.8rem;
//       margin-left: -1.65rem;
//       width: 3.3rem;
//       background: #fff;
//       padding-bottom: .29rem;
//       .title{
//         padding:.1rem .1rem;
//         font-size: .18rem;
//       }
//       .fruit {
//         font-size: .24rem;
//         color: #3b3b3b;
//         padding: .3rem 0 .4rem 0;
//         text-align: center;
//         line-height: .22rem;
//       }
//     }

//     .test-btn {
//       width: .9rem;
//       font-size: .15rem;
//       text-align: center;
//       line-height: .35rem;
//       background: #40cccd;
//       color: #fff;
//       margin: 0 auto;
//     }
//     .check {
//       padding: 0 .2rem .15rem .2rem;
//       &:after {
//         content: "";
//         display: table;
//         clear: both;
//       }
//       span {
//         font-size: .15rem;
//         color: #888;
//         margin-right: .06rem;
//         position: relative;
//         top: .06rem;
//       }
//       input {
//         //width:.08rem;
//         //height: .08rem;
//         padding: .5rem;
//       }
//       div {
//         color: #3b3b3b;
//         font-size: .15rem;
//         width:1.4rem;
//         &:first-child {
//           float: left;
//         }
//         &:last-child {
//           float: right;
//         }
//       }
//       .lf-select {
//         position: relative;
//         width: 68%;
//         display: inline-block;
//       }
//     }
//     .explain {
//       font-size: .15rem;
//       text-align: left;
//       padding: 0 .2rem .24rem .2rem;
//       color: #000;
//     }
//   }

//   .rooms {
//     span {
//       color: #888;
//       font-size: .15rem;
//     }

//   }

// }


$blue: #75cbeb;
$green: #40cccd;


.list-reply{
    position: relative;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    .sub-bg{
      position: absolute;
      width: auto;
      height: 100vh;
      overflow: hidden;
    }

    h3,h4{
      font-weight: 400;
    }

    .transition{
      transition: .2s;
    }

    .subject{
        float: left; 
        width: 100vw;
        height: 100vh;
        box-sizing: border-box;

        .subject-title{
          padding: .1rem .25rem;
          display: flex;
          flex-direction: column;
          justify-content: space-around;
          width: 100%;
          min-height: 20%;
          max-height: 30%;
          box-sizing: box-sizing;
        }

        .topic{
          padding: .1rem .25rem;
          width: 100%;
          min-height: 60%;
          max-height: 70%;
          box-sizing: border-box;

          .desc{
            display: inline-block;
            width: .6rem;
          }

          .more-input{
            display: block;
            width: 100%;
            height: .4rem;
            // height: 0;
            // padding: 0;
            // border: 0;

            // &.show{
            //   margin-bottom: .2rem;
            //   height: .4rem;
            //   border: 1px solid rgba(0,0,0,0.2);
            //   padding: 10px 15px;
            // }
          }
        }

        .title{
          display: flex;
          margin-bottom: .1rem;
          align-items: center;

          >input{
            width: .2rem;
            height: .2rem;
            margin-right: .1rem;
          }
        }
    }

    .bottom{
     
      position: fixed;
      bottom: 0;
      width: 100%;
      
      .btn{
        display: flex;
        padding: .2rem .15rem;
        justify-content:space-between;
        box-sizing: border-box;
        width: 100%;
        height: .8rem;

        >a{
            display: flex;
            justify-content:center;
            align-items: center;
            width: 48%;
            color: #fff;
        }
      }

      .page{
        margin-bottom: 0;
        text-align: center;
      }

      .prev{
          background: $green;
      }

      .next{
          background: $blue;
      }

      .bank{
         background: #aaa;
      }

  }
}
